@extends('Admin.layouts.common')

@section('content')
    <div class="container ">
        <div id="order_tag"></div>
        <div class="table-responsive">
         <form method="post" action="/config/edit_subclass/{{$id}}">
            {{ csrf_field() }}
            <table class="table"  >
                <caption>配置参数列表</caption>
                <input type="button" onclick="add();" value="添加" />
                <thead>
                    <tr>
                        <th><a href="javascript:void(0);" data-order="title">配置标志</a></th>
                        <th><a href="javascript:void(0);" data-order="title">配置参数</a></th>
                        <th><a href="javascript:void(0);" data-order="title">操作</a></th>
                    </tr>
                </thead>
                <tbody id="tab"> 
                    @foreach($list as $k=>$v)
                        <tr>
                            <td><input type="text" name="key['{{$k}}']"  class="form-control" value="{{ $k }}"></td>
                            <td><input type="text" name="val['{{$k}}']"  class="form-control" value="{{ $v }}"></td>
                            <td><input type="button" class="del-tr" value="删除"></td>
                        </tr>
                    @endforeach
                </tbody>
            </table><br>
            <div class="form-group">
                <button class="btn btn-primary btn-block" type="submit">编辑</button>
            </div>
        </form>
        </div>
    </div>

 <script type="text/javascript">
    function add(){
    var trHtml=[];
     var num = $("input").length;//input的数量
    trHtml.push('<tr>');
    trHtml.push('<td> <input type="text"  name="key['+num+']" class="form-control"></td>');
    trHtml.push('<td> <input type="text"  name="val['+num+']" class="form-control"></td>');
    trHtml.push('<td><input type="button" class="del-tr"  value="删除"></td>');
    trHtml.push('</tr>');
     $('tbody').append(trHtml.join(','));
    }
    $('body').on("click", ".del-tr", function () {
        var eq_num=$(this).parent().parent().index();
        $('tbody tr').eq(eq_num).remove();
    })
</script> 
@endsection